<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Spring Session Test</title>
    <script>
        function setSession() {
            var username = document.getElementById('username').value;
            fetch('/session', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                },
                body: 'username=' + encodeURIComponent(username)
            })
            .then(response => response.text())
            .then(data => {
                console.log(data);
                document.getElementById('sessionInfo').textContent = data;
            })
            .catch((error) => {
                console.error('Error:', error);
            });
        }

        function getSession() {
            fetch('/session')
            .then(response => response.text())
            .then(data => {
                console.log(data);
                document.getElementById('sessionInfo').textContent = data;
            })
            .catch((error) => {
                console.error('Error:', error);
            });
        }
    </script>
</head>
<body>
<h1>Spring Session Test</h1>
<label for="username">Username:</label>
<input type="text" id="username" name="username">
<button onclick="setSession()">Set Session</button>
<button onclick="getSession()">Get Session</button>
<p id="sessionInfo"></p>
</body>
</html>